<template>
  <div id="layout">
    <navbar v-on:logout="logout"></navbar>
    <div id="wrapper">
      <slidebar></slidebar>
      <div id="right">
        <keep-alive>
          <router-view/>
        </keep-alive>
      </div>
    </div>
  </div>
</template>

<script>
import Navbar from '@/components/Navbar.vue'
import Slidebar from '@/components/Slidebar.vue'
import Cookies from 'js-cookie'

export default {
  name: 'layout',
  components: {
    Navbar,
    Slidebar
  },
  created() {
    // Cookies.set('token', 'asdf')
    if (!Cookies.get('token')) {
      this.logout()
    }
  },
  methods: {
    logout() {
      Cookies.remove('token')
      this.$store.commit('setPath', this.$route.path)
      this.$router.replace({ path: '/login' })
    }
  }
}
</script>
<style lang="stylus" rel="stylesheet/stylus">
.pageBox 
  padding 0 0 10px
.el-tag
  margin 2px 4px
.icon.el-icon-success
  color #f56c6c
.icon.el-icon-error
  color #bbbbbb
</style>
<style scoped lang="stylus" rel="stylesheet/stylus">
#wrapper
  display flex
  justify-content space-between
  height calc(100vh - 50px)
  overflow hidden
#right
  flex 1
  text-align left 
  padding 20px
  position relative
  box-sizing border-box
  overflow hidden
</style>